﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="bootstrap.min.css">
    <title></title>
</head>
<body>
    <div class="row">
        <div class="col-md-12" style="text-align: center;"><h1>添加卡号接口示例</h1></div>
    </div>
    <form class="form-horizontal">
        <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">提示:</label>
            <div class="col-sm-10">
                <label for="inputEmail3" class="control-label">调用该接口可以直接将卡号信息下发到设备中</label>
            </div>
        </div>
        <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label">请求格式:</label>
            <div class="col-sm-8 input-group" style="padding-left:15px;padding-right:15px">
           
                <input type="text" class="form-control" id="SN" placeholder="设备SN">
                <span class="input-group-addon" id="basic-addon2">/AddCard</span>
            </div>
        </div>
        <div class="form-group">
            <label for="inputEmail3" class="col-sm-2 control-label"><span style="color:red">*</span>卡号:</label>
            <div class="col-sm-8">
                <input type="email" class="form-control" id="cardData" placeholder="卡号取值范围 0x1-0xFFFFFFFF" value="">
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">卡密码:</label>
            <div class="col-sm-8">
                <input type="text" class="form-control" id="password" placeholder="无密码不填。密码是4-8位的数字" value="">
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">出入截止日期:</label>
            <div class="col-sm-8">
                <input type="datetime-local" class="form-control" id="expiry" placeholder="最大2089年12月31日" value="2089-12-31T23:59:59">
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">刷卡有效次数:</label>
            <div class="col-sm-8">
                <input type="text" class="form-control" id="openTimes" placeholder="取值范围：0-65535;65535表示无限制" value="">
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">门权限:</label>
            <div class="checkbox col-sm-1">
                <label>
                    <input type="checkbox" checked="checked" name="door">门1
                </label>
            </div>
            <div class="checkbox col-sm-1">
                <label>
                    <input type="checkbox" checked="checked" name="door">门2
                </label>
            </div>
            <div class="checkbox col-sm-1">
                <label>
                    <input type="checkbox" checked="checked" name="door">门3
                </label>
            </div>
            <div class="checkbox col-sm-1">
                <label>
                    <input type="checkbox" checked="checked" name="door">门4
                </label>
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">上传区域:</label>
            <div class="col-sm-8">
                <select class="form-control" id="areaType">
                    <option value="0">非排序区</option>
                    <option value="1">排序区</option>
                </select>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="button" onclick="AddPerson()" class="btn btn-default">添加</button>
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">发送参数:</label>
            <div class="col-sm-8">
                <textarea class="form-control" id="Param" style="height:200px" placeholder="发送参数"></textarea>
            </div>
        </div>
        <div class="form-group">
            <label for="inputPassword3" class="col-sm-2 control-label">返回结果:</label>
            <div class="col-sm-8">
                <textarea class="form-control" id="Result" style="height:200px" placeholder="返回结果"></textarea>
            </div>
        </div>
    </form>
    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="jquery.min.js"></script>
</body>
</html>
<script type="text/javascript">
    function AddPerson() {
        var sn = $("#SN").val();
        if (sn.length != 16) {
            alert("请输入16位SN号");
            return;
        }
        var data = GetData();
        if (data === undefined) {
            return;
        }
        var url = "/" + sn + "/AddCard";
        var param = JSON.stringify(data);
        $("#Param").val(param);
        $.ajax({
            type: "POST",
            url: url,
            contentType: "application/json;charset=utf-8",
            data: param,
            dataType: "json",
            success: function (message) {
                //  alert(message);
                $("#Result").val(JSON.stringify(message));
            }
        })

    }
    function GetData() {
        var data = {};
        var cardData = Number($("#cardData").val());
        var password = $("#password").val();
        var expiry = $("#expiry").val();
        var openTimes = Number($("#openTimes").val());

        if (isNaN(cardData) || cardData <= 0 || cardData >= 0xffffffff) {
            alert("卡号错误");
            return;
        }
        data["cardData"] = cardData;
        if (password.length > 0) {
            var p = Number(Number(password));
            if (isNaN(p) || password.length < 4 || password.length > 8) {
                alert("卡密码错误");
                return;
            }
            data["password"] = password;
        }
        if (expiry.length > 0) {
            expiry = expiry.replace("T", " ");
            data["expiry"] = expiry;
        }
        if (openTimes > 0 && openTimes <= 65535) {
            data["openTimes"] = openTimes;
        }
        var checkid = $("input[name='door']");
        var doors = {};
        for (var i = 0; i < checkid.length; i++) {
            if (checkid[i].checked) {
                doors["door" + (i + 1)] = true;
            }
            else {
                doors["door" + (i + 1)] = false;
            }

        }
        data["doors"] = doors;
        var obj = {
            "areaType": Number($("#areaType").val()),
            "cards": [data]
        }
        return obj;
    }
</script>